<template>
	<view class="wh100" :id="id"> </view>
</template>
<script>
	import Pdfh5 from 'pdfh5'
	import 'pdfh5/css/pdfh5.css'
	const snowyUuid = () => {
		let uuid = 'xxx-4xxx-yxxx'.replace(/[xy]/g, (c) => {
			let r = (Math.random() * 16) | 0,
				v = c === 'x' ? r : (r & 0x3) | 0x8
			return v.toString(16)
		})
		// 首字符转换成字母
		return 'xn' + uuid.slice(2)
	}
	const id = snowyUuid()
	export default {
		name: '',
		props: {
			url: {
				type: String,
				default: () => ''
			}
		},
		components: {},
		data() {
			return {
				id: snowyUuid()
			}
		},
		methods: {
			init() {
				if (this.pdfh5) {
					this.pdfh5.destroy()
					this.pdfh5 = null
				}
				if (!this.pdfh5) {
					console.info(`this.url:`, this.url)
					setTimeout(() => {
						this.pdfh5 = new Pdfh5('#' + this.id, {
							// data: this.url // pdf文件流
							pdfurl: this.url
						})
					}, 800)
				}
			}
		},
		watch: {
			url() {
				this.init()
			}
		},
		computed: {},
		mounted() {
			this.init()
		}
	}
</script>
<style lang="less" scoped>
	.wh100 {
		width: 100%;
		height: 100%;
	}
</style>
